<template>
  <el-input ref="input" v-model.trim="currentValue">
    <el-button slot="append" icon="el-icon-search" @click="search"/>
  </el-input>
</template>
<script>
export default {
  name: 'SearchInput',
  props: {
    value: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      currentValue: this.value || ''
    }
  },
  created() {
    this.$nextTick(() => {
      const input = this.$refs.input
      input && input.focus()
    })
  },
  methods: {
    search() {
      this.$emit('search', this.currentValue)
    }
  }
}
</script>
